<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <title>帖子列表</title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link rel="shortcut icon" href="favicon.ico"> 
    <link href="${ctx!}/assets/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="${ctx!}/assets/css/font-awesome.css?v=4.4.0" rel="stylesheet">

    <link href="${ctx!}/assets/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">

    <link href="${ctx!}/assets/css/animate.css" rel="stylesheet">
    <link href="${ctx!}/assets/css/style.css?v=4.1.0" rel="stylesheet">

</head>

<body class="gray-bg">
    <div class="wrapper wrapper-content  animated fadeInRight">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox ">
                    <div class="ibox-title">
                        <h5>举报管理</h5>
                    </div>
                    <div class="ibox-content">
                        <hr />
                            <div>
                                &nbsp;&nbsp;&nbsp;
                                <input placeholder="用户昵称" id="neckName">
                                &nbsp;&nbsp;&nbsp;
                                <input placeholder="段子文本" id="contentText">
                                <button type="button" id="select" class="btn btn-info"style="margin-top: 10px;height: 30px;width: 64px;"> 搜索 </button>
                            </div>
                            <div class="row row-lg">
                                <div class="col-sm-12">
                                    <!-- Example Card View -->
                                    <div class="example-wrap">
                                        <div class="example">
                                            <table id="table_list"></table>
                                        </div>
                                    </div>
                                    <!-- End Example Card View -->
                                </div>
                            </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 全局js -->
    <script src="${ctx!}/assets/js/jquery.min.js?v=2.1.4"></script>
    <script src="${ctx!}/assets/js/bootstrap.min.js?v=3.3.6"></script>


	<!-- Bootstrap table -->
    <script src="${ctx!}/assets/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
    <script src="${ctx!}/assets/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
    <script src="${ctx!}/assets/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>

    <!-- Peity -->
    <script src="${ctx!}/assets/js/plugins/peity/jquery.peity.min.js"></script>

    <script src="${ctx!}/assets/js/plugins/layer/layer.min.js"></script>

    <!-- 自定义js -->
    <script src="${ctx!}/assets/js/content.js?v=1.0.0"></script>

    <!-- Page-Level Scripts -->
    <script>
        $(document).ready(function () {
			//初始化表格,动态从服务器加载数据
            $(function () {
                //1.初始化Table
                var oTable = new TableInit();
                console.log(1111)
                oTable.Init();
                console.log(2222)
            });

        });

        var TableInit = function () {
            var oTableInit = new Object();
            $('#table_list').bootstrapTable('destroy');
            oTableInit.Init = function () {
                $("#table_list").bootstrapTable({
                    //使用get请求到服务器获取数据
                    method: "get",
                    //必须设置，不然request.getParameter获取不到请求参数
                    contentType: "json",
                    //获取数据的Servlet地址
                    url: "${ctx!}/complain/content/page",
                    queryParams: function (params) { // 请求服务器数据时发送的参数，可以在这里添加额外的查询参数，返回false则终止请求
                        return {
                            contentText: $("#contentText").val(),
                            neckName: $("#neckName").val(),
                            impaechType: 1, // 额外添加的参数
                            pageNumber:params.pageNumber,
                            pageSize: params.pageSize, // 每页要显示的数据条数
                            offset: params.offset, // 每页显示数据的开始行号
                            sort: params.sort, // 要排序的字段
                            sortOrder: params.order, // 排序规则
                        }
                    },
                    // data: {
                    //     impaechType:1,
                    //     pageSize: 10,
                    //     pageNumber: 1,
                    //     sortOrder: 'desc'
                    // },
                    //表格显示条纹
                    striped: true,
                    //启动分页
                    pagination: true,
                    //每页显示的记录数
                    //			    pageSize: 100,
                    //			    //当前第几页
                    //			    pageNumber: 1,
                    //记录数可选列表
                    pageList: [10, 20, 30, 50],
                    //是否启用查询
                    search: false,
                    //是否启用详细信息视图
                    detailView:true,
                    detailFormatter:detailFormatter,
                    //表示服务端请求
                    sidePagination: "server",
                    //设置为undefined可以获取pageNumber，pageSize，searchText，sortName，sortOrder
                    //设置为limit可以获取limit, offset, search, sort, order
                    queryParamsType: "undefined",
                    //json数据解析
                    responseHandler: function(res) {
                        return {
                            "rows": res.content,
                            "total": res.totalElements
                        };
                    },
                    //数据列
                    columns: [{
                        title: "段子ID",
                        field: "dyContentId",
                        sortable: true
                    },{
                        title:"被举报次数",
                        field:"impeachCount"
                    },{
                        title: "段友昵称",
                        field: "publisherDyName"
                    },{
                        title: "上传时间",
                        field: "uploadDate"
                    },{
                        title: "段子内容",
                        field: "contentText"
                    },{
                        title: "段子媒体链接",
                        field: "contentUrl",
                    },{
                        title:"查看媒体详情",
                        field:"contentUrl",
                        formatter:function (value, row, index) {
                            if (value != '' || value != undefined) {
                                operateHtml = '<a onclick="urlInfo(\''+value+'\',\''+row.contentType+'\')">查看媒体内容</a>';
                                return operateHtml;
                            }
                        }
                    },
                        {
                            title: "审核时间",
                            field: "exTime",
                        },{
                            title: "审核人",
                            field: "exuserName"
                        },{
                            title: "审核结果",
                            sortable: true,
                            field: "exResult",
                            formatter: function (value, row, index) {
                                if(value == 0)
                                    return '<span class="label label-info">通过</span>';
                                else if(value == 1)
                                    return '<span class="label label-danger">不通过</span>';
                            }
                        },{
                            title: "操作",
                            align: 'center',
                            valign: 'middle',
                            formatter: function (value, row, index) {
                                operateHtml = '<button class="btn btn-danger btn-xs" type="button" onclick="del(\''+row.dyContentId+'\')"><i class="fa fa-remove"></i>&nbsp;删除</button>';
                                return operateHtml;
                            }
                        }],
                    onLoadSuccess: function(){  //加载成功时执行
                        console.info("加载成功");
                    },
                    onLoadError: function(){  //加载失败时执行
                        console.info("加载数据失败");
                    }
                });
            }

            return oTableInit;
        }

        urlInfo = function(url,contentType){
			var winWidth = window.innerWidth;
			var winHeight = window.innerHeight;
			var top = (winHeight-400)/2;
			var left = (winWidth-600)/2;
            // var child = '<div>';
			// if (contentType == 4) {//4表示视频
			// 	child += '<video class="" src="'+url+'" ' +
			// 			'poster="http://resource.dyouclub.com/videoSample/file1_C4DACE061530611234552.jpg" controls="" autoplay=""></video>';
			// }else {
			// 	chile += '<img id="" src="'+url+'" />';
			// }
			// child += '</div>';
			// $("#urlData").append(child);
			// $("#blocked").attr("style","width: 600px;height: 400px;top:"+top+";left:"+left+";");
			// $("#blocked").fadeIn();

            window.open(url,'','width=600,height=400,top='+top+',left='+left+'')
		}

        // closeDiv = function(){
        //     $("#urlData").append();
        //     $("#blocked").hide();
		// }

        function del(id){
        	layer.confirm('确定删除吗?', {icon: 3, title:'提示'}, function(index){
        		$.ajax({
    	    		   type: "POST",
					   data:{"contentId":id},
    	    		   dataType: "json",
    	    		   url: "${ctx!}/complain/content/deleteById",
    	    		   success: function(msg){
	 	   	    			layer.msg(msg.message, {time: 2000},function(){
	 	   	    				$('#table_list').bootstrapTable("refresh");
	 	   	    				layer.close(index);
	 	   					});
    	    		   }
    	    	});
       		});
        }
        
        function detailFormatter(index, row) {
	        var html = [];
	        html.push('<p><b>内容详情:</b> ' + row.contentText + '</p>');
	        return html.join('');
	    }

        $("#select").bind("click", function(){
            console.log(444)
            var oTable = new TableInit();
            oTable.Init();
        });
    </script>

    
    

</body>

</html>
